// popup openaccount
$(document).ready(function(){
	var width_popup = ($(window).width()-$('.popup-openaccount').width())/2;
	var height_popup = ($(window).height()-$('.popup-openaccount').height())/2;
	
	var width_popup_forgotpassword = ($(window).width()-$('.popup-forgotpassword').width())/2;
	var height_popup_forgotpassword = ($(window).height()-$('.popup-forgotpassword').height())/2;
	
	if(height_popup >0)
	{
		$('.popup-openaccount').css('top',height_popup+'px');
		$('.popup-forgotpassword').css('top',height_popup_forgotpassword+'px');
	} else {
		$('.popup-openaccount').css('top','0px');
		$('.popup-forgotpassword').css('top','0px');
	}
	if(width_popup >0)
	{
		$('.popup-openaccount').css('left',width_popup+'px');
		$('.popup-forgotpassword').css('left',width_popup_forgotpassword+'px');
	} else {
		$('.popup-openaccount').css('left','0px');
		$('.popup-forgotpassword').css('left','0px');
	}
	$('.openaccount, .forgot').click(function(){
		var width=$(document).width();
		var height=$(document).height();
		$('.dialog3').css('display','block');
		$('.dialog3').css('opacity','0');
		$('.dialog3').css('width',width+'px');
		$('.dialog3').css('height',height+'px');
		
		var selected = $(this).attr("class");
		
		if(document.all)
		{
			$('select').css('display','none');
		}
		$('.dialog3').animate({
				opacity:0.5
		}, 300, function() {
				if (selected == "openaccount") {
					$('.popup-openaccount').css('display','block');
				} else if (selected == "forgot") {
					$('.popup-forgotpassword').css('display','block');
				}
			$('.dialog3').click(function(){
				if (selected == "openaccount") {
					$('.popup-openaccount').css('display','none');							
				} else if (selected == "forgot") {
					$('.popup-forgotpassword').css('display','none');
				}					
				
				$('.dialog3').animate({
					opacity:0
				  }, 300, function() {
					$('.dialog3').css('display','none');
					$('.dialog3').unbind('click');
					if(document.all)
					{
						$('select').css('display','block');
					}	
				  });				
			});
		});
		return false;
	});
	
	//SELLBUY TAB
	$('.sellBuyMenu li.sell').click(function(){			
		$(this).addClass('active');
		$('.sellBuyMenu li.buy').removeClass('active');
		$('.sellBuy .info-sell').removeClass('hidden');
		$('.sellBuy .info-buy').addClass('hidden');
	});
	$('.sellBuyMenu li.buy').click(function(){			
		$(this).addClass('active');
		$('.sellBuyMenu li.sell').removeClass('active');
		$('.sellBuy .info-buy').removeClass('hidden');
		$('.sellBuy .info-sell').addClass('hidden');
	});	
	
	nextStep1();
	
	$(".popup-openaccount .steps .step-1").click(function () {
		nextStep1();
	});
	
	$(".popup-openaccount .steps .step-2").click(function () {
		checkValidStep1();
		
		if ($(".stage-1 label.error").length == 0) {
			var action = "gig/ajax_register.php";
			var form_data = getFormValue('step-1');
			$.ajax({
				type: "POST",
				url: action,
				data: form_data,
				dataType: "json",
				success: function(response)
				{
					if (response.success == true) {
						nextStep2();
					} else {
						alert(response.message);
					}
					
					
				}
			});
			
		}
	});
	
	//CLOSE POPUP
	$('.button-close-popup').click(function() {
		resetRegisterValue();
		$('.popup-openaccount, .popup-forgotpassword, .dialog3').css('display','none');
	});
	
	$(".stage-1 label").removeClass("error");
	$(".stage-2 label").removeClass("error");
	
	var txtUsername = $(".stage-1 input[name=username]").val();
	var txtPassword = $(".stage-1 input[name=password]").val();
	var txtEmail = $(".stage-2 input[name=email]").val();
	var txtCountry = $(".stage-2 select[name=Country]").val();
	
	var errorUsername = $(".errorMessage-caUsername > span");
	var errorPassword = $(".errorMessage-caPassword > span");
	var errorEmail =  $(".errorMessage-caEmail > span");
	var errorCountry =  $(".errorMessage-caCountry > span");
	var errorSex =  $(".errorMessage-caSex > span");
	
	$(".stage-1 input[name=username]").focus(function(){
		if(txtUsername == $(this).val()) {
			$(this).val("");
		}
	});
	$(".stage-1 input[name=username]").focusout(function(){
		if($(this).val() == "") {
			$(this).val(txtUsername);
		}
	});
	
	$(".stage-1 input[name=password]").focus(function(){
		if(txtPassword == $(this).val()) {
			$(this).val("");
		}
	});
	$(".stage-1 input[name=password]").focusout(function(){
		if($(this).val() == "") {
			$(this).val(txtPassword);
		}
	});
	
	$(".stage-2 input[name=email]").focus(function(){
		if(txtEmail == $(this).val()) {
			$(this).val("");
		}
	});
	$(".stage-2 input[name=email]").focusout(function(){
		if($(this).val() == "") {
			$(this).val(txtEmail);
		}
	});
	
	//Checkvalid step 1 and next step
	$(".stage-1 .nextStage").click(function () {
		
		checkValidStep1();
		
		if ($(".stage-1 label.error").length == 0) {
			var action = "gig/ajax_register.php";
			var form_data = getFormValue('step-1');
			$.ajax({
				type: "POST",
				url: action,
				data: form_data,
				dataType: "json",
				success: function(response)
				{
					if (response.success == true) {
						errorUsername.parent().css("display", "none");
						errorPassword.parent().css("display", "none");
						nextStep2();
					} else {
						errorUsername.html(response.message + '<span></span>');
						errorUsername.parent().css("display", "block");
					}
					
				}
			});
			
		}
	});
	
	//Checkvalid step 1 and next step
	$(".stage-2 .complete").click(function () {
		
		checkValidStep2();

		if ($(".stage-2 label.error").length == 0) {
			var action = "gig/ajax_register.php";
			var form_data = getFormValue('step-2');
			$.ajax({
				type: "POST",
				url: action,
				data: form_data,
				dataType: "json",
				success: function(response)
				{
					if (response.success == true) {
						//Close popup
						errorEmail.parent().css("display", "none");
						//$('.popup-openaccount, .popup-forgotpassword, .dialog3').css('display','none');
						nextStep3();
						
					} else {
						errorEmail.html(response.message + "<span></span>");
						errorEmail.parent().css("display", "block");
					}
				}
			});
		}
	});
	
	$(".errorMessage-caUsername, .errorMessage-caPassword, .errorMessage-caEmail").click(function () {
		$(this).css("display", "none");
	});
	
	function nextStep1() {
		$(".popup-openaccount .steps").removeClass("stage2").removeClass("state3");
		$(".popup-openaccount .steps").addClass("stage1");
		$('.stageWrap_inner').animate({top: -470}, "slow");
	}
	
	function nextStep2() {
		$(".popup-openaccount .steps").removeClass("stage1").removeClass("state3");
		$(".popup-openaccount .steps").addClass("stage2");
		$('.stageWrap_inner').animate({top: -235}, "slow");
	}
	
	function nextStep3() {
		$(".popup-openaccount .steps").removeClass("stage1").removeClass("state2");
		$(".popup-openaccount .steps").addClass("stage2");
		$('.stageWrap_inner').animate({top: 0}, "slow");
	}
	
	
	function checkValidStep1 () {
		
		$(".stage-1 label").removeClass("error");
		
		var username = $(".stage-1 input[name=username]");
		var password = $(".stage-1 input[name=password]");
		
		if (username.val().length == 0 || username.val() == txtUsername) {
			errorUsername.html("Please provice your username" + "<span></span>");
			errorUsername.parent().css("display", "block");
			username.parent().addClass("error");
		} else {
			username.parent().removeClass("error");
			errorUsername.parent().css("display", "none");
		}
		
		if (password.val() == txtPassword) {
			errorPassword.html("Please provice password!" + "<span></span>");
			errorPassword.parent().css("display", "block");
			password.parent().addClass("error");
		} else if (password.val().length < 2 || password.val().length > 8) {
			errorPassword.html("password lenght is between 2 and 8" + "<span></span>");
			errorPassword.parent().css("display", "block");
			password.parent().addClass("error");
		} else {
			password.parent().removeClass("error");
			errorPassword.parent().css("display", "none");
		}
		
	}
	
	
	function checkValidStep2() {
		$(".stage-2 label").removeClass("error");
		
		var email = $(".stage-2 input[name=email]");
		var country = $(".stage-2 select[name=Country]");
		var sex = $(".stage-2 input[name=sex]:checked");
		
		var pattern=/^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
		
		if(!pattern.test(email.val())){
			errorEmail.html("email is not valid!" + "<span></span>");
			errorEmail.parent().css("display", "block");
			email.parent().addClass("error");
		} else {
			email.parent().removeClass("error");
			errorEmail.parent().css("display", "none");
		}
		
		if (country.val().length == 0 || country.val() == txtCountry) {
			errorCountry.html("Please choise country!" + "<span></span>");
			errorCountry.parent().css("display", "block");
			country.parent().addClass("error");
		} else {
			errorCountry.parent().css("display", "none");
			country.parent().removeClass("error");
		}
		
		if (sex.val() == null || sex.val() == "") {
			errorSex.html("Please choise your gender!" + "<span></span>");
			errorSex.parent().css("display", "block");
			sex.parent().addClass("error");
		} else {
			errorSex.parent().css("display", "none");
			sex.parent().removeClass("error");
		}
		
	}
	
	function resetRegisterValue() {
		//Remove error
		$(".stage-1 label").removeClass("error");
		$(".stage-2 label").removeClass("error");
		
		//Hidden error message
		errorUsername.parent().css("display", "none");
		errorPassword.parent().css("display", "none");
		errorEmail.parent().css("display", "none");
		errorCountry.parent().css("display", "none");
		errorSex.parent().css("display", "none");
		
		///Set default value
		$(".stage-1 input[name=username]").val(txtUsername);
		$(".stage-1 input[name=password]").val(txtPassword);
		$(".stage-2 input[name=email]").val(txtEmail);
		$(".stage-2 select[name=Country]").val(txtCountry);
		$(".ui-autocomplete-input").val("Your Country");
		//Change to step 1
		nextStep1();
	}
	
	function getFormValue(step) {
		var form_data = {
				username: $(".stage-1 input[name=username]").val(),
				email: $(".stage-2 input[name=email]").val(),
				pwd: $(".stage-1 input[name=password]").val(),
				country: $(".stage-2 input[name=country]").val(),
				sex: $(".stage-2 input[name=sex]").val(),
				is_ajax: 1,
				step: step
			};
		return form_data;
	}
});